<template>
    <el-submenu v-if="menu.children && menu.children.length >= 1" :index="menu.menuUrl">
        <template slot="title">
            <i :class="menu.menuIcon" ></i>
            <span slot="title">{{menu.menuName}}</span>
        </template>
        <Tree v-for="item in menu.children" :key="item.id" :menu="item"></Tree>
    </el-submenu>
    <el-menu-item v-else :index="menu.menuUrl" @click="handleRoute(menu)">
        <i :class="menu.menuIcon"></i>
        <span slot="title">{{menu.menuName}}</span>
    </el-menu-item>
</template>

<script>
    /**
     * 侧边栏树
     */
    export default {
        name: "Tree",
        props:{
            menu:{
                type:Object,
                required:true
            }
        }
    }
</script>

<style scoped>

</style>